*{
  padding: 0;
  margin: 0;
}
.bgccc{
  background: #ccc;
}
.color-white{
  color: white;
}
.color-err{
  color: #ff4f4f;
}
.color-333{
  color: #333;
}
.color-ccc{
  color: #ccc;
}
.color-aaa{
  color: #aaa;
}

/* 盒子 */
.p0{
  padding: 0 !important;
}
.p20{
  padding: 20px;
}
.pt10{
  padding-top: 10px;
}
.pt15{
  padding-top: 15px;
}
.pb10{
  padding-bottom: 10px;
}

.pb15{
  padding-bottom: 15px;
}
.pl20{
  padding-left: 20px;
}
.pr20{
  padding-right: 20px;
}
.m5{
  margin: 5px;
}
.m15{
  margin: 15px;
}
.mt5{
  margin-top: 5px;
}
.mt15{
  margin-top: 15px;
}
.ml15{
  margin-left: 15px;
}
.ml30{
  margin-left: 30px;
}
.ml100{
  margin-left: 100px;
}
.mlauto{
  margin-left: auto;
}
.mrauto{
  margin-right: auto;
}
.mr15{
  margin-right: 15px;
}
.mb15{
  margin-bottom: 15px;
}
.mb20{
  margin-bottom: 20px;
}
.mb40{
  margin-bottom: 40px;
}

/* 弹性盒子 */
.flex{
  display: flex;
}
.flex-align-center{
  align-items: center;
}
.flex-end{
  justify-content: end;
}
.flex-center{
  justify-content: center;
}
.flex-1{
  flex: 1;
}
.flex-2{
  flex: 2;
}
.align-center{
  align-self: center;
}
.align-end{
  align-self: flex-end;
}

/* 定位相关 */
.absolute{
  position: absolute;
}
.l50{
  left: 50px;
}
.b100{
  bottom: 100px;
}

/* 字体相关 */
.fs12{
  font-size: 12px;
}
.fs13{
  font-size: 13px;
}
.fs40{
  font-size: 40px;
}
.fw600{
  font-weight: 600;
}
.f-i{
  font-style: italic;
}
.letter-5{
  letter-spacing: 5px;
}
.text-center{
  text-align: center;
}

.br3{
  border-radius: 3px;
}

.relative{
  position: relative;
}
.absolute{
  position: absolute;
}
.t5{
  top: 5px;
}
.t50{
  top: 50%;
}
.l50{
  left: 50%;
}